<template>
    <div>
        <div>


            <div style="width: 50%; height: 300px ;margin-left: 10px" class="card" id="pie1"></div>
        </div>
    </div>
</template>

<script>
    import * as echarts from 'echarts';


    //饼状图数据结构
    let pieOptions = {
        xAxis: {
            type: 'category',
            data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
        },
        yAxis: {
            type: 'value'
        },
        series: [
            {
                data: [120, 200, 150, 80, 70, 110, 130],
                type: 'bar'
            }
        ]
    }


    export default {

        name: 'Home',
        data() {
            return {

            }
        },
        mounted() {
            this.loadAll()
        },


        methods: {
            loadAll() {

                let chartDom = document.getElementById('pie1');
                let myChart = echarts.init(chartDom);
                myChart.setOption(pieOptions);
            },
        },



    }
</script>